<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<script>
    $(function () {
        //分页操作
        $(".btn_page").click(function () {
            //给表单的中的当前页设置数据
            //或运算返回第一个值或者最后一个元素的值
            var pageNo = $(this).data("page") || $(":text[name=currentPage]").val();
            $(":text[name=currentPage]").val(pageNo);
            //提交表单
            $("#searchForm").submit();
        });

        $(function () {
            //pageSize回显
            $(":input[name=pageSize] option[value='${pageResult.pageSize}']").prop("selected", true);
        })

        //pageSize值改变事件
        $(":input[name=pageSize]").change(function () {
            //设置当前页为第一页
            $(":text[name=currentPage]").val(1);
            //提交表单
            $("#searchForm").submit();
        });
    })

</script>
<div class="ui_tb_h30">
    <div class="ui_flt" style="height: 30px; line-height: 30px;">
        共有
        <span class="ui_txt_bold04">${pageResult.totalCount}</span>
        条记录，当前第
        <span class="ui_txt_bold04">${pageResult.currentPage}/${pageResult.totalPage}</span>
        页
    </div>
    <div class="ui_frt">
        <input type="button" value="首页" class="ui_input_btn01 btn_page" data-page="1"/>
        <input type="button" value="上一页" class="ui_input_btn01 btn_page"
               data-page="${pageResult.prevPage}"/>
        <input type="button" value="下一页" class="ui_input_btn01 btn_page"
               data-page="${pageResult.nextPage}"/>
        <input type="button" value="尾页" class="ui_input_btn01 btn_page"
               data-page="${pageResult.totalPage}"/>

        <select name="pageSize" class="ui_select02">
            <%--提交到后台--%>
            <option>5</option>
            <option>10</option>
            <option>20</option>
        </select>
        转到第<input type="text" name="currentPage" value="${pageResult.currentPage}" class="ui_input_txt01"/>页
        <input type="button" class="ui_input_btn01 btn_page" value="跳转"/>
    </div>
</div>